import AppStatisticBanner from '../app-statistic-banner/AppStatisticBanner.vue';

export default {
  title: '校园物联/统计',
  component: AppStatisticBanner,
  parameters: {
    docs: {
      description: {
        component: `请配合 <span style="font-weight: bold;font-size: 14px;color: grey">vue、tailwindcss</span> 使用`
      }
    }
  },
  argTypes: {
    list: {description: '统计列表'},
  }
};

export const Basic = {
  name: '基本使用',
  render: (args) => ({
    components: {AppStatisticBanner},
    setup() {
      return {args};
    },
    template: '<AppStatisticBanner v-bind="args" style="width: 800px"/>',
  }),
  args: {
    list: [
      {
        label: '总数',
        value: '10个'
      },
      {
        label: '在线数',
        value: '7个'
      },
      {
        label: '离线数',
        value: '3个'
      },
      {
        label: '告警数',
        value: '4个'
      }
    ]
  }
};